<div class="layui-side layui-bg-black">
	<div class="layui-side-scroll">
		<#include "/apps/business/workorders/include/left.html">
	</div>
</div>
<div class="layui-body">
	<#include "/public/macro.html">
	<div class="row" style="border-bottom: 1px solid #EFEFEF;padding:5px;">
		<div class="col-lg-12" style="padding-left:0px;position: relative;">
			<div class="ukefu-bt"> 
				<div class="layui-icon ukewo-btn ukefu-content-ind" style="width: 40px;height: 40px;">
					<img src="/images/workorders.png"></div>
				<div class="ukefu-bt-text">
					<div class="ukefu-bt-text-title" style="font-weight:400;font-size:20px;">
						<#if workOrders??>${(workOrders.title!'')?no_esc}</#if>
					</div>
					<div class="ukefu-bt-text-content" style="">
						<#if workOrders?? && workOrders.createtime??><span style="font-size:15px;color:#AAAAAA;">工单创建时间：${workOrders.createtime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
						<#if workOrders?? && workOrders.updatetime??><span style="font-size:15px;color:#AAAAAA;margin-left:30px;">最后更新于：${workOrders.updatetime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
					</div>
					
				</div>
			</div>
		</div>
	</div>
	<h1 class="site-h1 ukefu-tab" style="height:26px;">
		<div class="ukefu-tab-title" style="margin-left:0px;">
			<ul class="tab-title" id="workDetailsTab">
				<li class="layui-this"><a href="/apps/workorders/workflow/detail.html?id=${workOrders.id!''}<#if task??>&taskid=${task.id!''}&orderid=${task.orderId!''}</#if>">工单详情</a></li>
				<li><a href="/apps/workorders/detail/dataevent.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">变更记录</a></li>
				<li><a href="/apps/workorders/detail/comments.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">回复记录</a></li>
				<#if workOrders.cusid??>
				<li><a href="/apps/contacts/detail.html?id=${workOrders.cusid!''}" data-toggle="load" data-target="#workOrderContent">联系人信息</a></li>
				</#if>
				<#if workOrderType?? && workOrderType.bpm && workOrders.bpmid?? && workOrders.memo??>
				<li><a href="/apps/bpm/instance/display.html?processid=${workOrders.bpmid!''}&orderid=${workOrders.memo!''}" data-toggle="load" data-target="#workOrderContent">流程信息</a></li>
				</#if>
			</ul>					
		</div>
	</h1>
	<div id="workOrderContent">
		<div class="row" style="border-bottom: 1px solid #EFEFEF;">
			<div class="col-lg-12" style="padding-left:0px;padding-right:0px;">
				<#include "/apps/business/workorders/include/info.html">
			</div>
		</div>
		<#if action?? && action == "approval">
		<#include "/apps/business/workorders/workflow/approval.html">
		<#else>
		<#include "/apps/business/workorders/workflow/comment.html">
		</#if>
	</div>
	<script>
		$(document).ready(function() {
			layui.use('form', function() {
				var form = layui.form;
				form.render(); //更新全部
			});
			$('#workDetailsTab li a').on("click" , function(){
				$('#workDetailsTab li').removeClass("layui-this");
				$(this).parent().addClass("layui-this");
			});
			
			layui.use(['element', 'flow'], function(){
			  	var element = layui.element ;
			  	var flow = layui.flow;
				flow.load({
				    elem: '#ukefu-comments' //指定列表容器
				   	,scrollElem:".ukefu-col-right"
				    ,done: function(page, next){ //到达临界点（默认滚动触发），触发下一页
				      $.get('/apps/workorders/comments.html?orderid=${workOrders.id!''}&p='+page, function(res){
				        //假设你的列表返回在data集合中
				        
				        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
				        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
				        next($('#ukefu-workorders-comment').append(res) , $(res).length > 0);    
				      });
				    }
				});
			});
			KindEditor.ready(function(K) {
				K.create('#content', {
					themeType : 'simple',
					width:"100%",
					resizeType:0,
					uploadJson : "/res/image/upload.html",
					items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
							 'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
							 'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
		            allowFileManager : false,
					fontsize:16
				});
			});
			KindEditor.options.cssData = "body { font-size: 15px; font-family:'Microsoft Yahei', 'Helvetica', 'Simsun', 'Arial';}";
		});
	</script>
</div>
